<template>
    <div>
        <Header>
        </Header>
        <div class="block" style="margin-left: 600px;margin-top: 50px">
            <el-timeline>
                <span style="color: red;font-size: 30px">分类----{{this.$route.params.categoriesName}}</span>
                <el-timeline-item style="margin-top: 20px"
                        v-for="(activity, index) in articles"
                        :key="index"
                        icon="el-icon-more"
                        type="primary"
                        color="#0bbd87"
                        size="large"
                        :timestamp="activity.created">
                    <router-link :to="{name:'BlogDetail',params:{articleId:activity.articleId}}">
                        {{activity.title}}
                    </router-link>
                </el-timeline-item>
            </el-timeline>
        </div>
    </div>
</template>

<script>
    import Header from "./component/Header";
    export default {
        name: "ArticleByCategories",
        components:{Header},
        data() {
            return {
                articles: []
            };
        },
        created() {
            const _this=this
            console.log(this.$route.params.categoriesName)
            this.$axios.get("http://39.106.115.234:8083/categories/"+this.$route.params.categoriesName).then(res=>{
                // console.log(res.data.data)
                // _this.activities=res.data.data
                console.log(res.data.data)
                _this.articles=res.data.data
            })
        }
    }
</script>

<style scoped>

</style>
